/* ************************************************************************************************

	Copyright (c) 2005-2006, IGR
	All Rights Reserved.
	Licensed under the Apache License version 2.0 or above.
	For more information on licensing, see:
        http://www.apache.org/licenses/


 ************************************************************************************************
 Objet IMAGE
 VERSION:0.85
 DATE:15/06/2006
 ************************************************************************************************
* a image in floating position 
* with its alternatives :
* 	image for mouse over, text for info bulle, image for inactive state.
*
* @param imageOut	image : A path to image file or a className which define a div's src and size
* @param left		Left shift / position fixed by boolFloatLeft/Right attribute
* @param top		Top shift  / position fixed by boolFloatLeft/Right attribute
* @param parent		parent of this Image object
* @param alternateText		alternate text
* @param imageOn alternate image when  mouse over : path or className
* @param objPar 	object for optionals parameters
* 			position	    specify the positions style : 'absolute'||'relative'
* 			boolFloatLeft   left floating style of image 
* 			boolFloatRight  right floating style of image 
* 			imageDisabled	alternate image for inactive state : path or className
**/

/**
*	Html construction of Widget :
*
*	---- DIV -- .divExt  (img-div) -----------------------------
*	|															|
*	|	--- DIV -- ._img	[(<imageOut|On>|<imageDisabled>)]---	|
*	|	|													|	|
*
**/

rialto.widget.Image 
= function(imageOut,left,top,parent,alternateText,imageOn,objParam) {
//==============================================================

	//----------  inherits  ---------------------------
	if (arguments.length == 0) return;

    this.base = rialto.widget.AbstractComponent;    

    var objPar = (typeof objParam != "undefined") ? objParam : {};
   
   
	objPar.type 	= 'image'+imageOut;
	objPar.left 	= left;    										
	objPar.top  	= top;
//	objPar.position = objPar.position;
    this.base(objPar);

        
	//----------  load attributes with parameters  ------------------------
    this.imgOn   = this.ImgRef = imageOut;
    if(imageOn && imageOn!=""){this.ImgRef2 = imageOn;}
    this.alt  = alternateText;

    //parametres optionnels
    //on met d'abord les valeurs par d?faut    
    // changed by fl 20051223 / pb crossClose button in tabs 
    // this.display="inline";    
    this.display = "block";   
    this.enable=true;
    this.avecLim=false;
    this.imageDisabled=imageOut;
    this.boolFloatRight=false;
    this.boolFloatLeft=false;
    this.onclick=null;
    //on modifie les ?ventuelles valeus pass?es dans l'objet
    if (objPar != null){               
        if (objPar.imageDisabled!=null){
            this.imageDisabled = objPar.imageDisabled;        
        }        
        if (rialto.lang.isBoolean(objPar.boolFloatRight)){
            this.boolFloatRight = objPar.boolFloatRight;        

        }
        if (rialto.lang.isBoolean(objPar.boolFloatLeft)){
            this.boolFloatLeft = objPar.boolFloatLeft;            
        }                        
    }  
	
	if(this.boolFloatLeft || this.boolFloatRight){
	        this.position="relative";
	}
	    
	//release object
	objPar=null;
	objParam=null;	
	this.base=null;
    //-------  private methods  -----------------------------------
    
    //------- images loading ---------------------------
    var oThis= this;
   
	//------  divExt Html construction  ----------------------
   
        
    this.divExt.style.position		 = this.position;
    this.divExt.style.display 		 = this.display;     
    this.divExt.style.left		 	 = this.left+"px";
    this.divExt.style.top			 = this.top+"px";
    this.divExt.className 			 = "img-div";   
    this.divExt.style.width = 'auto';         
    this.divExt.style.height = 'auto';         
    if(this.boolFloatLeft)
        this.divExt.style[ATTRFLOAT] ='left';
    if(this.boolFloatRight)
        this.divExt.style[ATTRFLOAT] ='right';

    if (this.alt != null) 
    	this.divExt.title = this.alt;
    
        
	//------- .divExt Events handler  --------------------------   
    //pour le onclick on ne met rien par defaut;
    //to revise / cursor (mouse) form this.onclick="";
        
		this.divExt.onmouseout = function(e){                                               
			        if (oThis.enable){
			            if (!e) e=window.event;
						oThis.$$loadImage();
			            //this.style.cursor="default";
			            oThis.onmouseout(e);                    
			        }
		}; 
    

    	this.divExt.onselectstart = function(){return false};
        
	    //image swap for roll-over
	                          

	    //si on bouge dans l'image on verifie les limites des fois qu'elle soit bonne ou au contraire plus bonne
	    this.divExt.onmousemove = function(e){            
	        if (oThis.avecLim){
	            if (!e) e=window.event;            
	            this.onmouseover(e);
	        }
	    };  
    
	    this.divExt.onmouseover = function(e){                        
	        if (!e) e=window.event;                               
	        if(oThis.verifLimReac(e)){                
	            if (oThis.enable){
	                //pour tester si l'image est active (on regarde si la fonction onclik est vide)                                                    	                
	                if (oThis.onclick){                        
	                    this.style.cursor="pointer";
	                }
	                else{                        
	                    this.style.cursor="default";
	                }
	                //swap l'image si il y en a une 2eme
	                if (oThis.ImgRef2) { 
	                	oThis.$$loadImage(altImg=true);                        
	                }
	            }
	            else{
	                this.style.cursor="default";
	            }
	            //appel du coding applicatif
	            oThis.onmouseover();
	        }
	        else{
	            this.onmouseout(e);                
	        }
	        stopEvent(e);
	    };  
    
	    this.divExt.onclick = function(e){
	        if (!e) e=window.event;
	        if(oThis.verifLimReac(e)){
	            if (oThis.enable && oThis.onclick){   
	                oThis.onclick(e);                
	                stopEvent(e);
	            }
	        }
	    }; 


	    this.divExt.ondblclick = function(e){
	        if (!e) e=window.event;
	        if(oThis.verifLimReac(e)){
	            if (oThis.enable){   
	                oThis.ondbleclick(e);                
	                stopEvent(e);
	            }
	        }
	    };

   
	//------  _img Html construction  ----------------------

    this._imgDiv = document.createElement("DIV");   
    this._imgImg = document.createElement("IMG");   


	this.$$loadImage();

	
    this.divExt.appendChild(this._img);

    this._img.onerror =   function (evt) {
        alert('pb de chargt d 1 image dans l obj js image de ref : '+this.src);
    }
    

	//-------  place in Html document hierachie--------------------
    if (parent!=null){this.placeIn(parent);};
    
    
    
    
}

rialto.widget.Image.prototype = new rialto.widget.AbstractComponent;

//not necessary but why not ?
rialto.widget.Image.prototype.getHtmlDD = function () {
	return this._img;
}
	
rialto.lang.extend (rialto.widget.Image,
{
	$$loadImage  : function (bAlt) {
		var wImgRef;
    
		if (!this.enable) {
			if (this.imageDisabled)
				wImgRef = this.imageDisabled;
			else
				return;
		}
		else	
			if (!bAlt )
				wImgRef = this.ImgRef;
			else 
				wImgRef = this.ImgRef2;

		// path
		if (wImgRef.indexOf(".") != -1) {
			this._imgDiv.style.display = 'none';
			this._imgImg.style.display = 'block';
			this._imgImg.src = wImgRef;
			this._img = this._imgImg;
		}
		// className
		else {
			this._imgImg.style.display = 'none';
			this._imgDiv.style.display = 'block';
			this._imgDiv.className = wImgRef;
			this._img = this._imgDiv;
		}
	}	
	,
	$changeImages : function (imageOut,imageOver,imageDisabled) {
 		if (imageOut != null)
 			this.imgOn   		= this.ImgRef = imageOut;
    	if (imageOver != null)
 			this.ImgRef2 		= imageOver;
 		if (imageDisabled != null)
	    	this.imageDisabled 	= imageDisabled;
    	
		 this.$$loadImage();		

	}
	,
	setLimReac : function(x,y,delX,delY){
	    //fonction qui indique la zone active pour le mouse over et le click
	    //x et y sont les points de depart
	    //delX et dely sont les longeurs
	    this.x=x;
	    this.y=y;
	    this.delX=delX;
	    this.delY=delY;
	    this.avecLim=true;
    },

	verifLimReac : function(e){    
	    //fonction qui verifie la zone active apres un  mouse over et le click   
	    if(this.avecLim){
	        if(window.event){
	            var evX=parseInt(e.offsetX)
	            var evY=parseInt(e.offsetY)               
	        }
	        else{
	            var evX=parseInt(e.layerX)
	            var evY=parseInt(e.layerY)
	        }
	        //on verifie que le point clique est dans la zone (>=x et <=x+delX...)
	        return((evX>=this.x && evX<=(this.x+this.delX)) && (evY>=this.y && evY<=(this.y+this.delY)))
	    }
	    else{
	        return true
	    }
	},

	setImageReference : function (imageOut,imageOver) {
		this.$changeImages(imageOut,imageOver);
	},

	setImages : function(imageOut,imageOver,imageDisabled) {
		this.$changeImages(imageOut,imageOver,imageDisabled);
	},	


	setAlt : function(alt) {       
	    this.alt=alt;
   		this._img.title=alt;   
	},

	masqueImage : function() {
	   rialto.deprecated('rialto.widget.Image','masqueImage','setVisible(false)');
	   this.setVisible(false); 
	},

	afficheImage : function() {
	   rialto.deprecated('rialto.widget.Image','afficheImage','setVisible(true)');
	   this.setVisible(true);
	},


	//Change le statut visible
	setVisible : function(visible){
	        
	    var oHtml=this.getHtmlExt();
	    if(visible){     	
	        oHtml.style.display='block';
	        this._img.style.display=this.display;
	    }
	    else{
	        oHtml.style.display='none';
	        //this.onblur();
	    }
	    this.visible=visible;
	    //traceExec('.setVisible('+visible+')',1);
	},

	inactive : function() {
	   rialto.deprecated('rialto.widget.Image','inactive','setEnable(false)');
	   this.setEnable(false); 
	},

	active : function() {
	    rialto.deprecated('rialto.widget.Image','active','setEnable(true)');
		this.setEnable(true);
	},


	//Change le statut actif
	setEnable : function(enable){
		this.enable=enable;	
		this.$changeImages(null,null,this.imageDisabled);
	},

	clignote : function(){
	       
	   if (this.imgOn==this.ImgRef){
	       this.imgOn=this.ImgRef2       
	   }
	   else{
	       this.imgOn=this.ImgRef
	   }  
	//   this._img.src=this.imgOn;
	   this._img.className = this.imgOn;
	   this.Tclignote=window.setTimeout("rialto.session.objects[\""+this.id+"\"].clignote()",500);
	},

	arreteClignote : function(){    
	    this.imgOn=this.ImgRef;
	//    this._img.src=this.ImgRef;
	    this._img.className = this.ImgRef;
	    if (this.Tclignote){window.clearTimeout(this.Tclignote);};    
	}
	,
	release: function(){	
	    this.divExt.onmouseout = null;
	    this.divExt.onselectstart = null;
	    this.divExt.onmousemove = null;
	    this.divExt.onmouseover = null;
	    this.divExt.onclick = null;
	    this.divExt.ondblclick = null;
	    this._img.onerror=null;    
	    this.$changeImages=null;
	    this.onclick=null;
	}
}
);


